<template>
	<view>
		<view class="face-container">
			<camera device-position="front" flash="off" class="camera" @error="error" v-if="showCamera">
				<cover-image src="../static/face_camera/bg.png" class="bg"></cover-image>
			</camera>
			<view class="image-container" v-if="showImage">
				<image mode="widthFix" class="photo" :src="photoPath"></image>
				<view class="cover"></view>
			</view>
		</view>
		<view class="desc">
			<!-- 人脸识别登录认证 -->
			<block v-if="mode == 'verificate'">
				<image src="../static/face_camera/tips.png" mode="widthFix" class="tips"></image>
				<text>请把面部放在圆圈内</text>
				<text>拍摄脸部来确认身份</text>
			</block>
			
			<!-- 人脸识别数据收集 -->
			<block v-if="mode == 'create'">
				<image src="../static/face_camera/face.png" mode="widthFix" class="face"></image>
				<text>请把完整面部放在圆圈内</text>
				<text>拍摄脸部来保存身份识别数据</text>
			</block>
		</view>
		<button class="btn" @tap="confirmHandle">{{ mode == 'create' ? '录入面部信息' : '身份核实' }}</button>
	</view>
</template>

<script>
let dayjs = require('dayjs');
export default {
	data() {
		return {
			mode: 'verificate',
			photoPath: '',
			showCamera: true,
			showImage: false,
			audio: null
		};
	},
	methods: {
		//摄像头调用失败
		error(resp){
		    const that=this
			uni.showModal({
					title: '提示信息',
					content: resp.detail.errMsg,
					success: function(resp) {
					   that.audio.stop()
					}
			});
		},
		//拍照
		confirmHandle:function(){
			let that=this
			that.audio.stop()
			//获取相机对象
			let ctx=uni.createCameraContext()
			//拍照处理
			ctx.takePhoto({
							quality:"high",
							success:function(resp){
								that.photoPath=resp.tempImagePath
								that.showCamera=false
								that.showImage=true
								//调用内置文件管理系统，来读文件
								uni.getFileSystemManager().readFile({
									filePath:that.photoPath,
									encoding:"base64",
									success:function(resp){ 			
										let base64='data:image:/png;base64,'+resp.data
										
									}
								});								
								
				}
			});
		}
	},
	onLoad: function(options) {
		let that = this;
		//that.mode = options.mode;
		that.mode ='create';
		//创建音频播放器
		const innerAudioContext = uni.createInnerAudioContext();
		that.audio = innerAudioContext; 
		innerAudioContext.src = that.url.voiceFace;
		//播放音频
		innerAudioContext.play()
	},
	// 隐藏或关闭界面
	onHide:function(){
		//停止播放音频
		if(this.audio!=null){
			this.audio.stop()
		}
	}
};
</script>

<style lang="less">
@import url('face_camera.less');
</style>
